/* eslint-disable react/no-unescaped-entities,import/prefer-default-export,react/jsx-indent-props,react/jsx-no-undef,react/jsx-first-prop-new-line,no-trailing-spaces,no-useless-constructor,prefer-const,padded-blocks,function-paren-newline */
import React from 'react';
import List, {ListItem, ListItemText, ListItemSecondaryAction} from 'material-ui/List';
import IconButton from 'material-ui/IconButton';
import AddIcon from 'material-ui-icons/Add';
import DeleteIcon from 'material-ui-icons/Delete';
import {withStyles} from 'material-ui/styles';

const styles = theme => ({});


class UserLists extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {

        const {classes, data, addType, itemClick} = this.props;

        let itmes = [];

        data.forEach(v => {
            itmes.push(
                <ListItem button key={v.userId}>
                    <ListItemText
                        primary={v.userName}
                        secondary={v.userId}/>
                    <ListItemSecondaryAction>
                        {
                            addType ?
                                <IconButton aria-label="Add" onClick={itemClick(addType, v)}>
                                    <AddIcon/>
                                </IconButton> :
                                <IconButton aria-label="Delete" onClick={itemClick(addType, v)}>
                                    <DeleteIcon/>
                                </IconButton>
                        }

                    </ListItemSecondaryAction>
                </ListItem>
            );

        });


        return (
            <div>
                <h3 style={{
                    textAlign: 'center',
                }}>所有人数</h3>
                <List style={{
                    width: 290,
                }}
                      dense={true}>

                    {
                        itmes
                    }


                    <ListItem button key="1">
                        <ListItemText
                            primary="这是什么东西???这是什么东西??"
                            secondary="12345678901234567890123456789015"/>
                        <ListItemSecondaryAction>
                            <IconButton aria-label="Add">
                                <AddIcon/>
                            </IconButton>
                        </ListItemSecondaryAction>
                    </ListItem>
                    <ListItem button>
                        <ListItemText
                            primary="这是什么东西???这是什么东西??"
                            secondary="12345678901234567890123456789015"/>
                        <ListItemSecondaryAction>
                            <IconButton aria-label="Add">
                                <AddIcon/>
                            </IconButton>
                        </ListItemSecondaryAction>
                    </ListItem>
                    <ListItem button>
                        <ListItemText
                            primary="这是什么东西???这是什么东西??"
                            secondary="12345678901234567890123456789015"/>
                        <ListItemSecondaryAction>
                            <IconButton aria-label="Add">
                                <AddIcon/>
                            </IconButton>
                        </ListItemSecondaryAction>
                    </ListItem>
                </List>
            </div>
        );
    }
}

export default withStyles(styles, {withTheme: true})(UserLists);